@import '../variables.less';

.h5ds-layout-setitem-title {
    color: @color1;
}

.h5ds-util-color {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    border-radius: 100px;
    background: #fff;

    &::after,
    &::before {
        content: '';
        display: inline-block;
        width: 12px;
        height: 12px;
        background: #ccc;
        position: absolute;
    }

    &::after {
        top: 0;
        left: 0;
        border-top-left-radius: 100px;
    }

    &::before {
        top: 12px;
        left: 12px;
        border-bottom-right-radius: 100px;
    }
}

.h5ds-util-color-inner {
    display: inline-block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 100;
}

.h5ds-util-color-btn {
    position: relative;
    z-index: 100;
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 100px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
    cursor: pointer;
}

.h5ds-util-color-box {
    position: absolute;
    z-index: 100;
}
